<template>
  <div class="son">
    <h1>子组件</h1>
    <h2>老爹的钱：{{ money }}</h2>
    <SonSon></SonSon>
  </div>
</template>

<script>
/* 
  目标：掌握使用provide函数和inject函数完成后代组件数据通讯

  provide 函数：
    作用：
      provide函数，把数据或函数提供给所有子孙后代组件
    语法：
      provide('key', value)
  inject 函数：
    作用：
      inject 函数，根据键名称获取到 provide 定义的数据。
    语法：
      const value = inject('key')
*/
import { inject } from 'vue'
import SonSon from './SonSon16.vue'
export default {
  name: 'Son',
  components: { SonSon },
  setup() {
    const money = inject('money') // 获取数据
    return { money }
  },
}
</script>

<style>
.son {
  background-color: pink;
  padding: 20px;
}
</style>
